<template>
  <div class="main">
    <h2>项目列表</h2>

    <div class="project-list">
      <project-card-mini
          v-for="(project, index) in projects"
          :key="index"
          :project="project"
      />
    </div>
  </div>
</template>

<script setup lang="ts">
import {ref} from "vue";
import ProjectCardMini from "../../../components/Report/ProjectCardMini.vue";
import {useUserStore} from "../../../stores/UserStore.ts";
import {ElMessage} from "element-plus";
import {getReportProjectForReview} from "../../../api/Report/projectData.ts";
const tenantId=useUserStore().userInfo.tenantId

//const svgUrl = ref('@/assets/ReviewFinished.svg');

const projects=ref<any>([])
const getProjectListAsync=async ()=>{
  const res=await getReportProjectForReview(tenantId)
  if(res.projects.length==0){
    ElMessage.error("无数据")
    return
  }
  console.log(res)
  for(let i=0;i<res.projects.length;i++){
    if (!projects.value[i]) {
      projects.value[i] = {};
    }
    projects.value[i].projectName=res.projects[i].projectName
    projects.value[i].amount=res.projects[i].cost
    projects.value[i].status=res.projectStatus[i]
    projects.value[i].createTime=res.projects[i].createTime.replace('T',' ')
    projects.value[i].completeTime=res.projectStatus[i]=='已完成'?res.projects[i].updateTime.replace('T',' '):''
    projects.value[i].dueDate=res.projects[i].dueDate!=null?res.projects[i].dueDate.replace('T',' '):'';
    projects.value[i].remark=res.projects[i].remark
    projects.value[i].progress=res.progress[i].toFixed(2)
  }
}
getProjectListAsync()




</script>

<style scoped>

.main {
  background-color: #FFFFFF;
  border-radius: 10px;
  color: #1a1a1a;

}
.project-list {
  display: flex;
  flex-wrap: wrap;
  gap: 1%;
  justify-content: flex-start;
  padding: 30px;
  margin-left: -1%;

}

.project-list > * {
  flex: 1 1 calc(33.33% - 1%);
  max-width: calc(33.33% - 1%);
  box-sizing: border-box;
  margin-bottom: 20px;

}

svg {
  width: 100%;
  height: 100%;
}
</style>